<template>
  <div>
    <a-card :bordered="false" style="margin-bottom: 10px;">
      <!-- 条件搜索 -->
      <div class="table-page-search-wrapper">
        <a-form :labelCol="labelCol" :wrapperCol="wrapperCol" ref="queryForm">
          <a-row :gutter="32">
            <a-col :span="6">
              <a-form-item label="日期">
                <a-range-picker format="YYYY-MM-DD" v-model="purchaseDate"  :show-today="true"/>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item label="查询条件">
                <a-input  placeholder="查询条件"  v-model="queryParam.condition" />
              </a-form-item>
            </a-col>
            <a-col>
              <span class="table-page-search-submitButtons" style="float: right;">
                <a-button type="primary" @click="handleQuery"><a-icon type="search" />查询</a-button>
                <a-button style="margin-left: 8px" @click="resetQuery"><a-icon type="redo" />重置</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>
    </a-card>
    <a-card :bordered="false" class="table-card">
      <advance-table
        :scroll="{x:true}"
        title="安装统计表" :pagination="{
        current: queryParam.pageNum,
        pageSize: queryParam.pageSize,
        total: total,
        showSizeChanger: true,
        showLessItems: true,
        showQuickJumper: true,
        showTotal: (total, range) => `第 ${range[0]}-${range[1]} 条，总计 ${total} 条`,
        onChange: changeSize,
        onShowSizeChange: onShowSizeChange
      }" tableKey="base-bizOrder-index-table" rowKey="id" @refresh="getList"

        :columns="columns" :data-source="dataList" :loading="loading" :format-conditions="true">
        <div class="table-operations" slot="button">
          <a-button type="primary"  @click='print'>
            <a-icon />打印
          </a-button>
          <a-button type="primary" v-hasPermi="['biz:bizReportInstallStatistics:export']" :loading="downLoading"  @click='exportExcel'>
            <a-icon />导出
          </a-button>
        </div>
      </advance-table>
    </a-card>
    <ant-modal
      :visible="open"
      modal-title="打印安装统计表"
      :adjust-size="false"
      @cancel="cancel"
      modalHeight="550"
      modalWidth="1000">
      <a-row slot="content">
        <iframe height='425' width='985' style='border:none;' :src='printUrl' ></iframe>
      </a-row>

      <div slot="footer">
        <a-button @click="cancel">关闭</a-button>
      </div>
    </ant-modal>
  </div>

</template>
<script>
import AdvanceTable from '@/components/pt/table/AdvanceTable'
import { listInstallStat } from '@/api/biz/bizInstallStat'
import AntModal from '@/components/pt/dialog/AntModal'
import storage from 'store'
import { ACCESS_TOKEN } from '@/store/mutation-types'
import listMixin from '@/mixins/listMixin';
import { openDownloadDialog, sheet2blob} from "@/utils/util"
export default {
  name: 'PurchaseIndex',
  components: {
    AdvanceTable,
    AntModal
  },
  mixins:[listMixin],
  data() {
    return {
      printUrl:'/api/biz/bizOrderInstaller/printInstallStat?Authorization='+storage.get(ACCESS_TOKEN),
      printUrlPath:'/api/biz/bizOrderInstaller/printInstallStat?Authorization='+storage.get(ACCESS_TOKEN),
      open:false,
      title:'安装统计',
      listFunc:(param)=>listInstallStat(param),
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 选中的主键集合
      selectedRowKeys: [],
      // 选中的数据集合
      selectedRows: [],
      // 高级搜索 展开/关闭
      advanced: false,
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 总条数
      total: 0,
      // label的百分比
      labelCol: { span: 6 },
      // 内容区域的百分比
      wrapperCol: { span: 18 },
      statusOptions: [],
      payOptions: [],
      // 表格数据
      dataList: [],
      // 仓库字典
      warehouseIdOptions: [],
      // 供应商列表
      supplierOptions: [],
      // 查询参数
      queryParam: {
        pageNum: 1,
        pageSize: 11,
        purchaseDate: undefined,
        supplierCode: undefined,
        status: undefined
      },
      purchaseDate:undefined,
      columns: [
        {
          title: '日期',
          dataIndex:'installDate',
          align: 'center'
        },
        {
          title: '编号',
          dataIndex:'orderNumber',
          align: 'center'
        },
        {
          title: '客户名称',
          dataIndex:'customerName',
          align: 'center'
        },
        {
          title: '地址',
          dataIndex:'address',
          align: 'center'
        },
        {
          title: '型号',
          dataIndex:'model',
          align: 'center'
        },

        {
          title: '品牌',
          dataIndex:'brand',
          align: 'center',
        },
        {
          title: '颜色',
          dataIndex:'color',
          align: 'center'
        },
        {
          title: '规格',
          dataIndex:'spec',
          align: 'center'
        },

        {
          title: '数量',
          dataIndex:'number',
          align: 'center'
        },
        {
          title: '单位',
          dataIndex:'unit',
          align: 'center'
        },
        {
          title: '安装师傅',
          dataIndex:'installerName',
          align: 'center'
        },

        {
          title: '安装',
          align: 'center',
          children:[{
            title: '计件单价',
            dataIndex:'installDeduct',
            align: 'center',
          },{
            title: '计件工资',
            dataIndex:'installAmount',
            align: 'center',
          }]
        },
        {
          title: '备注',
          dataIndex:'remark',
          align: 'center',
          width: '10%'
        }
      ]
    }
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询销售单列表 */
    getList() {
      this.loading = true
      if(this.purchaseDate && this.purchaseDate.length>0) {
        this.queryParam.startDate=this.purchaseDate[0].format('yyyy-MM-DD');
      } else {
        this.queryParam.startDate=undefined;
      }
      if(this.purchaseDate && this.purchaseDate.length>1) {
        this.queryParam.endDate = this.purchaseDate[1].format('yyyy-MM-DD');
      } else {
        this.queryParam.endDate=undefined;
      }
      let params = Object.assign({},this.queryParam,{pageSize:this.queryParam.pageSize - 1})
      listInstallStat(params).then(response => {
        this.dataList = response.data.list
        this.total = response.data.total
        this.loading = false
        this.tableAddTotalRow(this.columns,this.dataList)
      })
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParam.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.queryParam = {
        pageNum: 1,
        pageSize: 11,
        purchaseDate: undefined,
        supplierCode: undefined,
        status: undefined

      }
      this.handleQuery()
    },
    /** 翻页操作 */
    onShowSizeChange(current, pageSize) {
      this.queryParam.pageSize = pageSize
      this.getList()
    },
    /** 翻页操作 */
    onSizeChange(current, size) {
      this.queryParam.pageNum = 1
      this.queryParam.pageSize = size
      this.getList()
    },
    /** 翻页操作 */
    changeSize(current, pageSize) {
      this.queryParam.pageNum = current
      this.queryParam.pageSize = pageSize
      this.getList()
    },
    /** 翻页操作 */
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
      this.ids = this.selectedRows.map(item => item.id)
      this.single = selectedRowKeys.length !== 1
      this.multiple = !selectedRowKeys.length
    },
    cancel() {
      this.open=false;
    },
    async exportExcel() {
      let columns = []
      this.columns.forEach(val=>{
        if (val.dataIndex) {
          columns.push(val)
        }else{
          if (val.children) {
            val.children.forEach(v=>{
              columns.push(v)
            })
          }
        }
      })
      let aoa = [columns.map(v=>v.title)]
      this.downLoading = true
      // 获取要导出的数据
      let dataSource = await this.loadAllData(1)
      this.downLoading = false
      for (let i = 0; i < dataSource.length; i++) {
        let item = []
        for (let l = 0; l < columns.length; l++) {
          let column = columns[l]
          if(column.dataIndex !== 'rowIndex'){
            let text = dataSource[i][column.dataIndex] || ''
            // 有自定义方法
            if(typeof(column.customRender) ==="function"){
              let res = column.customRender(text,dataSource[i])
              // 返回的是node节点
              if(res && typeof(res.componentOptions)!="undefined"){
                text = res.componentOptions.children[0].text
              }else{
                text = res || ''
              }
            }
            item.push(text)
          }
        }
        aoa.push(item)
      }
      let sheetName = this.title +'_'+ ((new Date()).getTime())
      openDownloadDialog(sheet2blob(aoa), sheetName)
    },
    print() {
      this.printUrl=this.printUrlPath+"&r="+Math.random();
      if(this.purchaseDate && this.purchaseDate.length>0) {
        this.printUrl+="&startDate="+this.purchaseDate[0].format('yyyy-MM-DD');
      }
      if(this.purchaseDate && this.purchaseDate.length>1) {
        this.printUrl+="&endDate="+this.purchaseDate[0].format('yyyy-MM-DD');
      }
      if(this.queryParam.condition) {
        this.printUrl+="&condition="+this.queryParam.condition;
      }
      this.open=true;
    }
  }
}
</script>
<style>
.ant-modal-body {
  padding: 5px;
  font-size: 14px;
  line-height: 1.5;
  word-wrap: break-word;
}
</style>